@charset "utf-8";



/* CSS Document */



.m-menubtn{position: fixed;z-index: 102;top:0;right: 0;width:60px;height:60px;cursor: pointer;-webkit-transition:.5s;transition:.5s; display:none}

.m-menubtn span{position: absolute;top:0;bottom: 0;left: 0; right: 0; width:20px;height:2px; background: #333; margin: auto;}

.m-menubtn span:before, .m-menubtn span:after {content: "";width: 100%;height: 100%;position: absolute;bottom: 0;left: 0;right: 0;margin: auto; background-color: #333;}

.m-menubtn span:before {bottom: 5px;}

.m-menubtn span:after {bottom: -5px;}

.m-menubtn.active span:before{-webkit-transform: rotate(-90deg);-moz-transform: rotate(-90deg);-o-transform: rotate(-90deg);-ms-transform: rotate(-90deg);transform: rotate(-90deg); background:#005bac}

.m-menubtn.active span:after {-webkit-transform: rotate(-90deg);-moz-transform: rotate(-90deg);-o-transform: rotate(-90deg);-ms-transform: rotate(-90deg);transform: rotate(-90deg);opacity: 0;}

.m-menubtn.active span {-webkit-transform: rotate(45deg);-moz-transform: rotate(45deg);-o-transform: rotate(45deg);-ms-transform: rotate(45deg);transform: rotate(45deg); background:#005bac}

.m-menubtn.active span, .m-menubtn.active span:before, .m-menubtn.active span:after {right: 0;bottom: 0;}

.m-menubtn span, .m-menubtn span:before, .m-menubtn span:after{-webkit-transition: all 0.5s cubic-bezier(0.5, 0, 0, 1);-moz-transition: all 0.5s cubic-bezier(0.5, 0, 0, 1);-o-transition: all 0.5s cubic-bezier(0.5, 0, 0, 1);transition: all 0.5s cubic-bezier(0.5, 0, 0, 1);}

/*.m-menubtn:before {content: "Menu";font-size: 12px;position: absolute;bottom: 10px; left: 0; right: 0; margin: auto;text-align: center; color:#fff}

*/

.m-menu{position:fixed; right:0;top:0; width:100%; height:100%;overflow-y:auto; overflow-x:hidden;visibility: hidden;transition: visibility 0ms linear 850ms;z-index:98;}

.m-menu:before{content:'';top: 0;left: 0;width: 100%;height: 100%; position: fixed;background-color: #005bac;transform: translateX(-100%);transition: transform 550ms cubic-bezier(0.55, 0.055, 0.675, 0.19) 350ms;}

.m-menu ul{ width:100%;padding-top:80px; padding-bottom:30px; padding-left:3%; padding-right:3%;overflow-y:auto;overflow-x:hidden;}

.m-menu li{ position: relative;border-bottom:1px solid rgba(255,255,255,.3);opacity: 0; transform: translateX(3.5rem);}

.m-menu li>a{ font-size:18px;line-height:60px; position:relative}

.m-menu li>a i{ position:absolute; width:20px; height:20px; right:0;top:50%; margin-top:-10px}

.m-menu li>a i:before{ content:""; width:20px; height:1px; background:#fff; position:absolute; left:0;top:10px;}

.m-menu li>a i:after{ content:""; width:1px; height:20px; background:#fff; position:absolute; left:10px;top:0;}

.m-menu li>a.on i:after{ -moz-transform:rotate(90deg);-webkit-transform:rotate(90deg);transform:rotate(90deg)}

.m-menu a{ display:block; color:#fff;}

.m-menu .sub{ display:none; padding-bottom:10px}

.m-menu .sub a{color:rgba(255,255,255,.5); line-height:30px;font-size:15px; padding-left:20px; position:relative}

.m-menu .sub a:before{content: "";position: absolute;bottom: 15px; left: 0; width: 10px; height: 1px; background: rgba(255,255,255,.5);}



.m-menu.active{visibility: visible; opacity:1;transition: visibility 0ms linear 0ms;}

.m-menu.active:before{transform: translateX(0%);transition: transform 750ms cubic-bezier(0.215, 0.61, 0.355, 1);}

.m-menu.active li{opacity: 1;transform: translateX(0);transition: opacity 500ms linear 375ms, transform 500ms cubic-bezier(0.215, 0.61, 0.355, 1) 375ms;}





.m-footer{color:#fff; position:fixed; width:100%; left:0;bottom:0; display:none; z-index:99;background: #005bac;

background: -webkit-linear-gradient(left, #22bcf0, #013e96);

background: -o-linear-gradient(right, #22bcf0, #013e96);

background: -moz-linear-gradient(right, #22bcf0, #013e96);

background: linear-gradient(to right, #22bcf0, #013e96);}

.m-footer li{ float:left; width:50%; text-align:center}

.m-footer a{ display:block; line-height:20px;color:#fff;}

.m-footer .tel i{ display:block;background:url(../images/f-icon01.png) no-repeat center; background-size:20px; height:25px;}

.m-footer .mail i{ display:block;background:url(../images/f-icon03.png) no-repeat center; background-size:20px; height:25px;}

.m-footer span{ display:block;}

.inner-nav-m{ display:none; position:absolute;right:0;top:0;width:100%;z-index:9}

.inner-nav-m .tit{font-size:16px; line-height:40px; height:45px; white-space:nowrap; text-overflow:ellipsis; padding-right:20px; color:#333; float:right;position:relative;}

.inner-nav-m .tit:after{ content:""; width:6px; height:6px; border-top:1px solid #333; border-right:1px solid #333; -moz-transform:rotate(45deg);-webkit-transform:rotate(45deg);transform:rotate(45deg); display:block; position:absolute;right:5px;top:16px}

.inner-nav-m .sub{position:absolute;top:45px; width:100%;left:0; background:#093580; display:none; }

.inner-nav-m .sub a{ display:block; border-bottom:1px solid rgba(255,255,255,.2); background:#093580; line-height:20px;color:#fff; padding:8px 10px}

.inner-nav-m .sub a:hover{ background:#f4ce1a;}



@media screen and (max-width:1920px){

.nbanner{height:450px;}

}

@media screen and (max-width:1700px){

.wrap{ width:1400px}

.hrcon{ padding:0}

.hrcon .txt{ padding-top:0}

.ygfuli li{padding:1% 1% 2%;}
.f-nav li{ margin-right:90px}
}

@media screen and (max-width:1440px){

.wrap{ width:86%}

.menu>ul>li{margin:0 25px}

.f-nav li{ margin-right:60px;max-width: 140px;}
.f-contact{ max-width:360px;}
.i-caselist .swiper-slide{ width:60%}

.nbanner{ height:350px}

.nbanner .nbantit{bottom:45%}

.inner-nav{height:60px; margin-top:-60px;}

.inner-nav li a{ font-size:20px;height: 60px;padding:1%}

.inner-nav-pro{height:80px; margin-top:-80px;}

.inner-nav-pro li a{height:80px;}

.newslist li h3{-webkit-line-clamp: 2;height:60px;}



}

@media screen and (max-width:1366px){

.menu>ul>li{margin:0 20px}

.space{ padding:45px 0 60px}

.footer-top{ padding-top:40px;}
.f-nav li{ margin-right:50px}
.f-nav li .tit, .f-contact .tit{font-size:16px; margin-bottom: 15px;}
.f-contact{max-width: 300px;}
.nbanner{ height:320px}
.nbanner .nbantit{ font-size:40px;}

.title, .main .title{ font-size:32px; line-height:35px;margin-bottom:30px;}

.message .ts{ margin-top:-20px}

.main .content-about .txt{ font-size:15px; line-height:28px}

.main .content-about .txt p{ margin-bottom:10px}

.hrcon .txt{font-size:15px; line-height:28px}

.hrcon .txt p{ margin-bottom:10px}

}

@media screen and (max-width:1250px){

.wrap{width:94%}

.main .content-about{ padding-top:0;background: url(../images/earth.jpg) no-repeat center top;background-size:contain}

.main .content-about h2{ margin-bottom:10px}

.main .content-about .txt{ width:100%}

.main .content-about .pic{ position:relative; width:100%; height:auto}

.main .content-about .pic img{ width:100%}

.main .content-about .aboutModal{ height:auto}

.main .content-about .pic:after{ display:none}



}

@media screen and (max-width:1024px){

.menu{ display:none}

.headerbox, .header, .logo{ height:60px;}

.logo img{ height:45px;}

.lang a{ line-height:60px;}

.m-menubtn{ display:block}

.lang{ margin-right:30px}

.anchor{top: -60px;}

.space, .main{ padding:40px 0 40px}

.title,.main .title{ font-size:30px; line-height:30px; margin-bottom: 25px;}

.title:after{width: 30px;height: 2px;}

.banner .swiper-pagination{bottom:3%}

.banner .swiper-pagination-bullet{ width:10px; height:10px;}

.banner.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet{ margin:0 5px}
.banner .swiper-button-prev, .banner .swiper-button-next{display:none}

.i-product.space{ padding-top:40px}

.i-prolist{ padding-top:10px}

.i-prolist h3{ font-size:20px;margin-top: 20px;}

.i-prolist .icon{ width:80px; height:80px;box-shadow: 0 0 0 10px rgba(0,91,172,.1);}

.i-prolist .icon img{ width:80px}

.i-caselist .swiper-button-prev, .i-caselist .swiper-button-next{ width:35px}

.footer-top{padding-top:30px;padding-bottom: 15px;}



.f-nav{ width:100%}
.f-nav ul{ justify-content:space-between}
.f-ewm{ position:relative}
.f-contact{ max-width:inherit}

.nbanner {height: 260px;}

.nbanner .nbantit{font-size:35px; left:50%; -moz-transform:translateX(-50%);-webkit-transform:translateX(-50%);transform:translateX(-50%)}

.nbanner.nbanner-cnt .nbantit{bottom:38%}

.inner-nav{height:50px; margin-top:-50px;}

.inner-nav li a{ font-size:16px;height:50px;}

.inner-nav li a:after{border-top-left-radius:10px;border-top-right-radius:10px;}

.main .content{ font-size:14px; line-height:28px}
.en .main .content{ line-height:26px}
.main .content-about .txt, .hrcon .txt{ font-size:14px;}

.cullist li{ padding:1%; line-height:20px}

.cullist li h4{ font-size:20px;margin-bottom: 10px;margin-top: 10px;}

.honorlist .swiper-pagination-bullet{ width:8px; height:8px;}

.newslist li .more{ margin-top:15px}

.newslist li .time{padding: 15px 0 5px;}

.newslist li h3{ font-size:18px; line-height:24px; height:48px}

.newstit{font-size: 24px; line-height:30px}

.newstm{ font-size:12px;margin-bottom: 20px;}

.news-article{ font-size:14px; line-height:28px}
.news-article img{ max-width:100%}
.main-product .section{ margin-top:20px}
.main-product .section .p-title{ font-size:26px;}
.main-product .section .p-title-marg{ margin-top:20px}

.hrcon .txt, .hrcon .pic{ width:100%}

.hrcon .txt .title{ text-align:center}

.hrcon .txt .title:after{ margin-left:auto}

.hrlist-top span{ font-size:14px;}

.interview .left{width: calc(100% - 180px);}



.school-recruitment .txt h3{ font-size:18px;}

.school-recruitment .txt{ font-size:14px;}

.school-recruitment .time{ float:none; width:auto}

.school-recruitment .txt{ width:100%; float:none}

.contact-list h3{ font-size:20px;}

.contact-list li{padding: 2% 3%;}

.main .content-contact{ font-size:14px;}

#allmap{ height:350px}

.message input[type=text], .message textarea{font-size:14px; line-height:45px;padding-left: 60px;}

.message .item:nth-child(4) input[type=text]{ padding-left:90px}

.message .yzm[type=text]{ padding-left:75px}
.message #captcha_img{ height:45px !important}
.message label{ line-height:45px;left: 10px;}

.message .submit{ width:100px;height:35px;line-height:35px;}



.nbanner.nbanner-pro .nbantit{ bottom:38%}

.inner-nav.inner-nav-pro{ margin-top:0; height:auto; background:rgba(0,0,0,.6)}

.inner-nav.inner-nav-pro .wrap{ width:100%}
.inner-nav.inner-nav-pro li{ width:20%}
.en .inner-nav.inner-nav-pro li{ width:25%}
.inner-nav.inner-nav-pro li a{ font-size:16px; height:100%;padding:0 10px 10px;}

.inner-nav.inner-nav-pro li a:after{border-top-left-radius: 0;border-top-right-radius: 0; height:100%}

.main-product .table th{ font-size:15px}

.main-product .table td{ font-size:14px;line-height:20px;}

.main-product .table01{ width:99.5%}
.TC-show{ width:94%}
}

@media screen and (max-width:768px){

.lang {margin-right: 50px;}

.space, .main{ padding:30px 0}

.title, .main .title{ font-size:26px; margin-bottom:20px}

.title:after{margin:10px auto 0;}

.banner .swiper-pagination-bullet{ width:8px; height:8px;}

.banner.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet{ margin:0 3px}

.content-about .title{ margin-bottom:10px}

.i-product.space{ padding-top:30px}

.i-prolist h3{ font-size:18px}

.i-caselist .swiper-slide{ width:100%}

.i-caselist .txt{ padding:20px}

.i-caselist .txt h3{ font-size:18px;}

.i-newslist{ padding-bottom:30px}

.i-newslist h3{ margin:10px 0 5px}

.i-newslist .time{ letter-spacing:0}

.i-newslist .swiper-pagination{ display:block}

.f-nav{ display:none}

.m-footer{ display:block}

.footer{ padding-bottom:50px}

.footer-top{ padding-top:20px}

.f-contact{max-width:100%;width:calc(100% - 200px);}

.footer-bot{padding: 10px 0 10px;font-size: 12px;}

.nbanner {height: 200px;}

.newslist li{ width:48%}

.newstit{ font-size:20px;line-height: 24px; margin-bottom:5px}

.page_2{ margin-top:30px}

.page_2 .back{ line-height:35px;width: 100px;}

.honorlist h3{ font-size:16px}

.honorlist a{ padding:0 15px 10px}

.main .content-about h2{ font-size:22px}

.caselist .txt{ padding:10px}

.caselist .swiper-pagination-bullet{ width:8px; height:8px; margin:0 3px}

.main-product .section .p-title{ font-size:24px}

.cullist ul{ margin-top:0}

.cullist li{ width:50%; padding-top:0; padding-bottom:2%;font-size: 12px;}

.cullist li .iconfont{ font-size:35px;line-height:35px;}

.cullist li:nth-child(4) .iconfont{ font-size:40px}

.cullist li h4{ font-size:18px; line-height:20px;margin-bottom: 5px;margin-top: 5px;}

.ygfuli p{ font-size:12px; line-height:18px}

.hrtit{padding: 10px 1%; position:relative}
.hrlist{padding: 0 1% 1%;}
.hrlist-top{ padding:12px 0}
.hrlist-top span:nth-child(1){ font-size:14px;}
.hrtit span:nth-child(2), .hrtit span:nth-child(3){ display:none}
.hrlist-top span:nth-child(2), .hrlist-top span:nth-child(3){ display:none}
.hrtit span:nth-child(4){width:auto;padding:0; position: absolute; right:2%;}
.hrlist-top span.arrow{ width:40px}
.hrtit span:nth-child(1), .hrlist-top span:nth-child(1){ width:calc(100% - 40px)}
.hrlist-top span.arrow::after{top:7px}

.interview{ padding:3%}

.interview .left{ width:100%; float:none}

.interview .left li{ width:100%; margin-right:0; padding:10px 0}

.interview .left li:nth-child(2){ padding-top:10px}

.interview .right{ float:none; width:160px; margin:20px auto 5px}

.hrlist-con{ padding:10px;}

.hrlist-con h4{ font-size:15px}

.apply-job{ text-align:center; margin-top:10px; margin-bottom:5px}

.apply-job a{ display:inline-block; width:auto; padding:0 15px;line-height:32px;}

.main-school{ background:#f3f3f3}

.main-school .title{ color:#333}

.school-recruitment{padding: 0 3% 4%;}

.school-recruitment li{ width:100%;padding:12px 0 12px 0;}

.school-recruitment .txt h3{ font-size:16px}



.message .item{ width:100%}

.message .ts{ font-size:12px; line-height:20px; margin-top: -10px;margin-bottom: 20px;}

.contact-list{ margin-bottom:10px}

.contact-list li{ width:100%; margin-bottom:2%}

.contact-list h3{ font-size:18px; margin-bottom:10px}

#allmap{ margin-top:0; height:300px}

.tablebox{ overflow-x:auto}

.inner-nav.inner-nav-pro li a{ font-size:14px;}
.pagination{padding:15px 0 0!important;}
}

@media screen and (max-width:640px){

.i-prolist{padding-top:0}

.i-prolist h3{ font-size:16px;margin-top: 10px;}

.i-prolist .icon{ width:60px; height:60px;box-shadow: 0 0 0 6px rgba(0,91,172,.1);}

.i-prolist .icon img{ width:50px}

.i-caselist .swiper-button-prev, .i-caselist .swiper-button-next{ width:25px}

.i-caselist .txt{ padding:10px}

.i-caselist .txt span{ display:none}

.i-caselist .txt h3{ font-size:16px;}

.i-newslist{ padding-bottom:20px}

.i-newslist h3{ font-size:16px;line-height: 20px; white-space:normal;display: -webkit-box;-webkit-line-clamp:2;-webkit-box-orient: vertical;overflow: hidden;text-overflow: ellipsis;}
.en .i-newslist h3{line-height: 20px;}
.nbanner {height:150px;}

.nbanner .nbantit{ font-size:26px}

.inner-nav{height:40px; margin-top:-40px;}

.inner-nav li a{height:40px;}

.main .content-about h2{ font-size:20px}

.newslist ul{ margin-right:0}

.newslist li{ width:100%; margin-right:0; margin-bottom:4%}

.newslist li .time{ padding-top:10px}

.newslist li h3, .en .newslist li h3{ height:auto; font-size:16px;line-height: 20px;}

.newslist li .more{ font-size:12px;margin-top:10px;}
.en .newslist li .time{ flex-wrap:wrap;justify-content:start}
.en .newslist li .time span{ display:block; width:100%}

.contact-list li{padding: 2% 4%;}

#allmap{ height:260px}

.message input[type=text], .message textarea, .message label{ line-height:40px}

.message .yzm[type=text]{ width:40%}
.message #captcha_img{ height:40px !important}
.inner-nav.inner-nav-pro{ background:none}

.inner-nav.inner-nav-pro .wrap{ flex-wrap:wrap;justify-content:flex-start}

.inner-nav.inner-nav-pro li{border-bottom: 1px solid rgba(255,255,255,.15);background: #666;}

.inner-nav.inner-nav-pro li:last-child{border-right: 1px solid rgba(255,255,255,.15);}

.inner-nav.inner-nav-pro li a{ font-size:12px}

.main .content-about{ background:none;}

}

@media screen and (max-width:480px){

.title, .main .title{ font-size:22px; line-height:24px;}

.title:after {margin: 5px auto 0;}

.space, .main{ padding:20px 0 30px}

.i-product.space{ padding-top:20px}

.i-prolist li{padding: 0 3px;}

.i-prolist .icon{ width:50px; height:50px;box-shadow: 0 0 0 5px rgba(0,91,172,.1);}

.i-prolist h3{ font-size:14px}
.en .i-prolist h3{ font-size:12px;}

.f-contact{ width:100%}

.f-ewm{ float:left}
.inner-nav li, .inner-nav.inner-nav-pro li, .en .inner-nav.inner-nav-pro li{ width:50%}
.cullist li, .en .cullist li{ width:100%;padding:0; padding-left:40px; padding-right:0; padding-bottom:3%; position:relative; text-align:left}
.cullist li:last-child{ padding-bottom:0}
.cullist li .icon{ position:absolute; left:0;top:4px}
.cullist li h4{ text-align:left; font-size:16px; margin:0; margin-bottom:2px}
.cullist li:first-child h4{ margin-top:0}
.cullist li .iconfont{ font-size:25px;line-height: 25px;}
.cullist li:nth-child(2) .iconfont{ font-size:22px}
.cullist li:nth-child(3) .iconfont{ font-size:22px}
.cullist li:nth-child(4) .iconfont{ font-size:30px}
.ygfuli li{ width:50%}
.ygfuli p{ margin-top:0}
.en .inner-nav li a{ font-size:14px;}
.en .newstit{ font-size:16px; line-height:20px}
.en .main .content-about .txt, .en .hrcon .txt{ line-height:24px}
.en .news-article{ line-height:24px}
.headerbox, .header{ min-width:320px}
.nbanner .nbantit{ font-size:22px}
.inner-nav li a{ font-size:15px}
}

@media screen and (max-width:425px){
.en .i-prolist{ overflow-x:auto}
.en .i-prolist::-webkit-scrollbar{display: none;}    
}